<template>
<div class="table-sheet-setting">
  <el-form>
    <el-form-item label="高度">
      <input-number-lazy v-model="activeData.height" style="width: 100%;"></input-number-lazy>
    </el-form-item>
  </el-form>
  <template v-if="showHeaderSetting">
    <el-divider>表头样式</el-divider>
    <style-setting :data="headerStyle" @change="emit('changeStyle', 'headerStyle', $event)"></style-setting>
  </template>
  <template v-if="showColumnSetting">
    <el-divider>列样式</el-divider>
    <style-setting :data="columnStyle" @change="emit('changeStyle', 'columnStyle', $event)"></style-setting>
    <el-divider>列编辑</el-divider>
    <column-editor-setting :data="columnEdit" @change="emit('changeColumnEdit', $event)"></column-editor-setting>
  </template>
</div>
</template>

<script>
import { mapGetters, emit } from '@/components/FormGenerator/store/tableSheet.js'
import StyleSetting from './styleSetting.vue'
import ColumnEditorSetting from './columnEditorSetting.vue'
export default {
  name: 'TableSheetSetting',
  props: {
    activeData: {
      type: Object
    }
  },
  components: {
    StyleSetting,
    ColumnEditorSetting
  },
  data() {
    return {};
  },
  created() {},
  mounted() {},
  methods: {
    emit
  },
  watch: {},
  computed: {
    ...mapGetters(['showHeaderSetting', 'showColumnSetting', 'headerStyle', 'columnStyle', 'columnEdit'])
  },
};
</script>

<style lang="scss" scoped>
</style>
